<template>
  <div>
    <el-container>
      <el-main>
        <el-tabs :data="tableData" type="border-card">
          <el-tab-pane label="计费项目查看">
            <el-form status-icon ref="tableData" label-width="120px" class="demo-tableData">
              <el-form-item label="计算项目名称:">
                <span>{{ this.tableData[0].payname }}</span>
              </el-form-item>
              <el-form-item label="项目优先级:">
                <span>{{ this.tableData[0].paylevel }}</span>
              </el-form-item>
              <el-form-item label="项目用量/时长:">
                <span>{{ this.tableData[0].paynum }}</span>
              </el-form-item>
              <el-form-item label="项目价格:">
                <span>{{ this.tableData[0].paymoney }}</span>
              </el-form-item>
              <el-form-item label="通知状态:">
                <span v-if="this.tableData[0].paystatus == 1">已通知</span>
                <span v-if="this.tableData[0].paystatus == 2">未通知</span>
              </el-form-item>
              <el-form-item label="通知人:">
                <span>{{ this.tableData[0].username }}</span>
              </el-form-item>
              <el-form-item label="通知内容:">
                <span v-html="this.tableData[0].paycontent"></span>
              </el-form-item>
            </el-form>
            <el-button
              type="primary"
              size="small"
              style="z-index:100;position:fixed;top:27%;right:20px;"
              @click="fanhui"
            >返回</el-button>
          </el-tab-pane>
        </el-tabs>
      </el-main>
    </el-container>
  </div>
</template>
  
  <script>
import Cookies from "js-cookie";
export default {
  data() {
    return {
      tableData: [],
      sendInfo: {
        id: "",
        token: ""
      }
    };
  },
  methods: {
    fanhui() {
      this.$router.push({
        path: "/charging/type"
      });
    },
    async getTableData() {
      const { data: res } = await this.axios.get(
        `http://community.byesame.com/cost/getCostDetail?id=${this.$route.query.detailId}`
      );
      console.log(res);
      this.tableData = res;
    }
  },
  mounted() {
    this.Token = Cookies.get("Admin-Token");
    this.getTableData();
  },
  components: {}
};
</script>
  
  <style lang="scss" scoped>
.el-container {
  background-color: rgb(240, 240, 240);
}
.el-main {
  margin: 1.3% 1%;
  padding: 0;
  background-color: #fff;
}
.el-form-item {
  padding-left: 20px;
}
</style>